$(function() {

    // 点击按钮的时候; 
    // 1. 渲染页面; 
    // 2. 渲染分页; 

    var container = document.querySelector(".container-my");
    var pagination = document.getElementById("pagination");
    var token = getCookie("token");

    function init() {
        let res = $.ajax({
                url: "http://127.0.0.1:8888/goods/list",
                data: { current: 3, pagesize: 30 },
                dataType: "json"
            })
            .then(function(res) {
                renderPage(res);
                renderBullets(res);
            })
    }

    function renderPage(res) {
        container.innerHTML = res.list.map(
            item =>
            `<div class="goods">
                              <img src="${item.img_big_logo}" alt="">
                              <h1>${item.title}</h1>
                              <h2>${item.price}</h2>
                              <p><button data-id="${item.goods_id}" class="btn btn-danger btn-small">加入购物车</button>
                        </div>`
        ).join("");
    }

    function renderBullets(res) {

        $("#pagination").pagination({
            pageCount: res.total,
            callback: function(instance) {
                // 自己写一下; 
                let res = $.ajax({
                        url: "http://127.0.0.1:8888/goods/list",
                        data: { current: instance.getCurrent(), pagesize: 30 },
                    })
                    .done(function(res) {
                        renderPage(res);
                    })
            }
        });
    }

    // 添加事件 : 

    $(".container-my").on("click", ".btn", handlerAddCart)

    // 增加购物车功能 ; 
    function handlerAddCart() {
        // 1. 获取用户 id ; 
        var user_id = getCookie("userid");
        // 2. 获取商品 id ; 
        var goods_id = $(this).attr("data-id");
        // 使用ajax工具发起请求 : 

        // 注意 : 我们发送加入购物车请求的时候，把数据放在params 里面不放在body里面
        var options = {
            url: `http://127.0.0.1:8888/cart/add?id=${user_id}&goodsId=${goods_id}`,
            type: "post",
            data: {
                id: user_id,
                goodsId: goods_id
            },
            headers: {
                authorization: token
            }
        }

        $.ajax(options)
            .done(function(data) {
                // console.log( data );
                handlerAjax(data);
            });
    }

    function handlerAjax(data) {
        switch (data.code) {
            case 1:
                alert(data.message);
                break;
            case 401:
                alert("抱歉您还没有登录，请登录后再去加入购物车");
                location.href = "./login.html#goods";
                break;
        }
    }

    init();

    initNav();
})